<!DOCTYPE html>
<html>
<body>
<script>

var sourceCanvas3D = document.createElement('canvas');
var sourceCtx = sourceCanvas3D.getContext('webgl');
var destCanvas3D = document.createElement('canvas');
var destCtx = destCanvas3D.getContext('webgl');
if (!sourceCtx || !destCtx) {
    console.logFatalError("WebGL is not supported or enabled on this platform!");
    throw "WebGL is not supported or enabled on this platform!";
}
document.body.appendChild(sourceCanvas3D);
document.body.appendChild(destCanvas3D);
var tex = null;
const width = 1024;
const height = 1024;

function setSize(width, height) {
    sourceCanvas3D.width = width;
    sourceCanvas3D.height = height;
    destCanvas3D.width = width;
    destCanvas3D.height = height;
}

function rand(range) {
    return Math.floor(Math.random() * range);
}

function renderWebGL(gl) {
    gl.disable(gl.SCISSOR_TEST);
    gl.clear(gl.COLOR_BUFER_BIT);
    gl.enable(gl.SCISSOR_TEST);
    gl.scissor(rand(width), rand(height), rand(width), rand(height));
    gl.clearColor(Math.random(), Math.random(), Math.random(), 1);
    gl.clear(gl.COLOR_BUFFER_BIT);
}

function preRun() {
    renderWebGL(sourceCtx);
    tex = destCtx.createTexture();
    destCtx.bindTexture(destCtx.TEXTURE_2D, tex);
}

function doRun() {
    destCtx.texImage2D(destCtx.TEXTURE_2D, 0, destCtx.RGBA, destCtx.RGBA, destCtx.UNSIGNED_BYTE, sourceCanvas3D);
}

function startPerfTest() {
    preRun();
    var i;
    for (i = 0; i < 10; i++) {
        doRun();
    }
    destCtx.readPixels(0, 0, 1, 1, sourceCtx.RGBA, sourceCtx.UNSIGNED_BYTE, new Uint8Array(4));
    requestAnimationFrame(startPerfTest);
}

window.onload = function () {
    setSize(width, height);
    startPerfTest();
}

</script>
</body>
</html>
